/*
 * @Date: 2022-03-29 15:54:31
 * @LastEditors: fenglan
 * @LastEditTime: 2022-04-12 09:17:51
 * @FilePath: /payment-7/pay/src/components/MangerCard/index.jsx
 */
import React, { useEffect, useState } from 'react'
import { Row, Col, Card } from 'antd'
import styles from './index.module.css'
import axios from '../../util/axios'
export default function MangerCard() {
  const [SH, SetSH] = useState([])
  const [DF, SetDF] = useState([])
  const [Today, SetToday] = useState([])
  const [Lastday, SetLastday] = useState([])
  useEffect(() => {
    axios({
      url: "/admin/select",
      method: 'get',
    }).then(res => {
      console.log(res.data);
      const arr = []
      const arr1 = []
      const arr2 = []
      const arr3 = []
      for (let k in res.data.ShangHu[0]) {
        switch (k) {
          case 'shzye':
            arr.push({ title: '商户总余额', price: res.data.ShangHu[0][k], key: '1', type: '元' })
            break;
          case 'shzkyye':
            arr.push({ title: '商户总可用余额', price: res.data.ShangHu[0][k], key: '2', type: '元' })
            break;
          case 'shzdjye':
            arr.push({ title: '商户总冻结余额', price: res.data.ShangHu[0][k], key: '3', type: '元' })
            break;
          case 'shzfkye':
            arr.push({ title: '商户总风控金额', price: res.data.ShangHu[0][k], key: '4', type: '元' })
            break;
        }
      }
      for (let i in res.data.DaiFu[0]) {
        switch (i) {
          case 'dfszye':
            arr1.push({ title: '代付商总余额', price: res.data.DaiFu[0][i], key: '1', type: '元' })
            break;
          case 'dfszfkye':
            arr1.push({ title: '代付商总风控金额', price: res.data.DaiFu[0][i], key: '2', type: '元' })
            break;
          case 'dfszkyye':
            arr1.push({ title: '代付商总可用余额', price: res.data.DaiFu[0][i], key: '3', type: '元' })
            break;
          case 'dfszdjye':
            arr1.push({ title: '代付商总冻结余额', price: res.data.DaiFu[0][i], key: '4', type: '元' })
            break;
        }
      }
      res.data.Jrczzje.forEach(item => arr2.push({ title: '今日充值总金额', price: item.money, key: '1', type: '元' }))
      res.data.Jrczzsxf.forEach(item => arr2.push({ title: '今日总充值手续费', price: item.money, key: '2', type: '元' }))
      res.data.Jrdfzje.forEach(item => arr2.push({ title: '今日代付总金额', price: item.money, key: '3', type: '元' }))
      res.data.Jrdfzbs.forEach(item => arr2.push({ title: '今日代付总笔数', price: item.count, key: '4', type: '笔' }))
      res.data.Jrdfzsxf.forEach(item => arr2.push({ title: '今日代付总手续费', price: item.money, key: '5', type: '元' }))
      res.data.Jryl.forEach(item => arr2.push({ title: '今日盈利', price: item.money, key: '6', type: '元' }))
      res.data.Zrczzje.forEach(item => arr3.push({ title: '昨日充值总金额', price: item.money, key: '1', type: '元' }))
      res.data.Zrczzsxf.forEach(item => arr3.push({ title: '昨日充值总手续费', price: item.money, key: '2', type: '元' }))
      res.data.Zrdfzbs.forEach(item => arr3.push({ title: '昨日代付总笔数', price: item.count, key: '3', type: '笔' }))
      res.data.Zrdfzje.forEach(item => arr3.push({ title: '昨日代付总金额', price: item.money, key: '4', type: '元' }))
      res.data.Zrdfzsxf.forEach(item => arr3.push({ title: '昨日代付总手续费', price: item.money, key: '5', type: '元' }))
      res.data.Zryl.forEach(item => arr3.push({ title: '昨日盈利', price: item.money, key: '6', type: '元' }))
      SetLastday(arr3)
      SetToday(arr2)
      SetDF(arr1)
      SetSH(arr)
    })
  }, [])
  return (
    <div>
      <Row gutter={16} className={styles.body}>
        {SH.map(item =>
          <Col span={4} key={item.key}>
            <Card title={item.title} bordered hoverable className={styles.item1} extra={<span className={styles.extra}>{item.type}</span>}>
              <span className={styles.font}>{item.price}</span>
            </Card>
          </Col>)}
      </Row>
      <Row gutter={16} className={styles.body}>
        {DF.map(item =>
          <Col span={4} key={item.key}>
            <Card title={item.title} bordered hoverable className={styles.item4} extra={<span className={styles.extra}>{item.type}</span>}>
              <span className={styles.font}>{item.price}</span>
            </Card>
          </Col>)}
      </Row>
      <Row gutter={16} className={styles.body}>
        {Today.map(item =>
          <Col span={4} key={item.key}>
            <Card title={item.title} bordered hoverable className={styles.item3} extra={<span className={styles.extra}>{item.type}</span>}>
              <span className={styles.font}>{item.price}</span>
            </Card>
          </Col>)}
      </Row>
      <Row gutter={16} className={styles.body}>
        {Lastday.map(item =>
          <Col span={4} key={item.key}>
            <Card title={item.title} bordered hoverable className={styles.item2} extra={<span className={styles.extra}>{item.type}</span>}>
              <span className={styles.font}>{item.price}</span>
            </Card>
          </Col>)}
      </Row>
    </div>
  )
}